Lalu ubah menjada dataresponse 


Edit Selection View Go Run Terminal Help e main dat - http reque: 


> createState() 


> extends 


void getData() a 
var myResponse 
await http.get(Uri.parse( 
); 


var dataResponse - json.decode(myResponse.body) as L 
print(data); 


DEBUG CONSOLE 

D/EGL emulation(29065): app time stats: avg=4919.5@ms min=4919.5@ms max=4919.5@ms cou 

I/flutter (29065): (fid: 1, name: Leanne Graham, username: Bret, email: Sincere@apri address: (stree 
t: Kulas Light, suite: Apt. 556, city: Gwenborough, zipcode: 92998-3874, geo: (lat: -37.3159, Ing: 81.149 
6)), phone: 1-770-736-8031 x56442, website: hildegard.org, company: (name: Romaguera-Crona, catchPhrase: M 
ulti-layered client-server neural-net, bs: harness real-time e-markets)), (id: 2, name: Ervin Howell, user 
name: Antonette, ema hanna@melissa.tv, address: (street: Victor Plains, suite: Suite 879, city: Wisoky 
burgh, zipcode: 90566 1, geo: ( 43.9509, Ing: -34.4618)), phone: 010-692-6593 x@9125, website: ana 


D 


DI e . E m O a e: E a 
Kemudain disni data yg ini diganti 
Data ini sudah ada didalam data respon 


Edit Selection View Go Run Terminal Help e main dart - http request - Visual Studio Co... IC) CQ (B | 08 — 


BED 4» 053 


State«HomePage» createState() -» HomePage 


void getData() a 
var myResponse - 
await http.get(Uri.parse( 
); 


var dataResponse - json.decode(myResponse.body) as List; 


H 


data - dataResponse; 


5 DEBUG CONSOLE 

D/EGL emulation(29065): app time stats: avg=4919.5@ms min=4919.5@ms max=4919.5@ms count=1 

I/flutter (29065): [{id: 1, name: Leanne Graham, username: Bret, email: Sinceregapril.b address: (stree 
t: Kulas Light, suite: Apt. 556, city: Gwenborough, zipcode: 92998-3874, geo: (lat: -37.3159, Ing: 81.149 
6)), phone: 1-770-736-8031 x56442, website: hildegard.org, company: (name: Romaguera-Crona, catchPhrase: M 
ulti-layered client-server neural-net, bs: harness real-time e-markets)), (id: 2, name: Ervin Howell, user 
name: Antonette, email: Shanna@melissa.tv, address: (street: Victor Plains, suite: Suite 879, city: Wisoky 
burgh, zipcode: 90566 1, geo: (lat: -43.9509, Ing: -34.4618)), phone: 010-692-6593 x@9125, website: ana 


B e . E B Bue $ A^ 
Sebelumnya buat perbandingan dahulu 
If ketika sukses maka menampilkan 
DataResponse kita ganti 


Dei 


B 3 053 


Jika status sukses maka menampilkan data ini jika tidak atau eror maka 
menampilkanj eror 


Selection View Go Run Terminal Help main.dart - http request - Visual Studio Co... DD O | 02 


class _HomeP tate extends State«HomeF 
5 


data = []; 


void getData() 
var myResponse 
await http.get(Uri.parse( 
)); 


if (myResponse.statusCode 


== 200) { 
var dataResponse = json.decode(myResponse.body) as List; 


data = dataResponse; 
lse ( 
( E 


DEBUG CC 

D/EGL emulation(29065): app time stats: avg=4919.5@ms min=4919.5@ms max=4919.5@ms cou 

I/flutter (29065): [{id: 1, name: Leanne Graham, username: Bret, email: Sincere@april , address: {stree 
t: Kulas Light, suite: Apt. 556, city: Gwenborough, code: 92998-3874, geo: (lat: - 9, Ing: 81.149 
6)), phone: 1-770-736-8031 x56442, website: hildegard.org, company: (name: Romaguera-Crona, catchPhrase: M 
ulti-layered client-server neural-net, bs: harness real-time e-markets)), (id: 2, name in Howell, use 
name: Antonette, email hanna@melissa.tv, address: (street: Victor Plains, suite: Suite 87 city: Wisoky 
burgh, zipcode: 90566 1, geo: (1 43.9509, lng: -34.4618)), phone: 010-692-6593 x09125, website: ana 


DI e. ec m D o e o: > ^o^ B B n dq») oss 


Coba jalankan tapi diprint dahulu 


void getData() asy 
var myResponse - 
await http.get(Uri.parse( 
)); 


if (myResponse.statusCode == 200) { 
var dataResponse = json.decode(myResponse.body) as List; 
data = dataResponse; 
print(data); 
{ 


print( 


@override 


Widaat huild(Ruildea vt rantavt1 f 


7 DEBUG CONSOLE 


D/EGL emulation(29065): app time stats: avg=5271.79ms min=5271.79ms max= 79ms count=1 

I/flutter (29065): (fid: 1, name: Leanne Graham, username: Bret, email: Sincere@april.biz, address: {stree 
t: Kulas Light, suite: Apt. 556, city: Gwenborough, zipcode: 92998-3874, geo: flat: -37.3159, Ing: 81.149 
6}}, phone: 1-770-736-8031 x56442, website: hildegard.org, company: (name: Romaguera-Crona, catchPhrase: H 
ulti-layered client-server neural-net, bs: harness real-time e-markets}}, {id: 2, name: Ervin Howell, user 
name: Antonette, email hanna@melissa.tv, address: (street: Victor Plains, suite: Suite 879, city: Wisoky 
burgh, code: 90566-7771, geo at: -43.9509, lng: -34.4618)), phone: 010-692-6593 x09125, website: ana 


stasia.net. comnanv: (name: Neckow-Crist. catchPhrase: Proactive didactic contingency. hs: svnergize scala 


Ec. e m Bu @ > 2 PT Xx 
Maka sudah berhasil isi data dari data get atau dataResponse 
Yg isi nya sudah respon data kita 
Lalu menampilkan bukan seperti ini 
Tetapi menampilkan seuah list 
Body nya kita ganti 


Dei 


LI NG dd 053 


Dgn listview.builder 
Kita akan mereturn ListTile 


Tapi sebelumnya data kita buat variabel yg baru 
dataUser = data[index] maka dia memecah 
lalu kita menampilkan dataUser 


Edit Selection View Go Run Terminal Help 


e main.dart - http request - Visual Studio Co... D CJ (IB | 08 


child: .get app), 


» 
appBar: 
title: 15 


builder(itemBuilder: ((context, index) { 
^ = data[ind 


(title: 


DEBUG CONSOLE 


(dataUs (DE 
Text(String data, (Key? key, TextStyle? 
style, StrutStyle? strutStyle, TextAlign? 
textAlign, TextDirection? textDirection, 
Locale? locale, bool? softWrap, 
TextOverflow? overflow, double? 
textScaleFactor, int? maxLines, String? 
semanticsLabel, TextWidthBasis? 
textWidthBasis, TextHeightBehavior? 
textHeightBehavior)) 


Creates a text widaet 


Disini isinya ada apa 


Maka ada name 


` Jer.typ X @ http | Dart Package 
C a & jsonplaceholder.typicode.com 
o T WA Maps @ INTROL 
am", 
": "Bret", 
il": "Sinceregapril.biz", 


ess": ( 
": "Kulas Light", 
Apt. 556", 
: "Gwenborough", 
": "92998-3874", 


e": "1-770-736-8031 x56442", 
"hildegard.org", 
1 


me": "Romaguera-Crona", 


s": "harness real-time e-markets" 


"Ervin Howell", 
"Antonette", 
Shanna@melissa.tv", 


“Victor Plains", 
: "Suite 879", 
“Wisokyburgh", 

: "90566-7771", 


"-43.9509", 
"; "-34.4618" 


Hc... € m o B m e a 


ItchPhrase": "Multi-layered client-server neural-net", 


9p 


sx D 


^ & B (gn d» 053 
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@ Je ^* O 


ef 


child: Icon(Icons.get app), 


E 
appBar: Ap 
title: T 


», 
body: ListView.builder(itemBuilder: ((context, index) { 
final dataUser = data[index]; 
returr tTile( 
title: Text( 
dataUser[ 


7 DEBUG CONSOLE clude 


EGL emulation(29065): app time stats: avg=5271.79ms min=5271.79ms 271.79ms count-1 


29065): [4 1, name: Leanne Graham, username: Bret, email: Sincere@april , address: {stree 


ight, suite: Apt. 556, city: Gwenborough, zipcode: 92998-3874, geo: (lat: -37.3159, lng: 81.149 
phone: 1-770-736-8031 x56442, website: hild a „ 
() Syncing files to device sdk gphon 
layered client-server neural-net, bs: harne = T 
name: Antonette, email: Shanna@melissa.tv, address: (street: Victor Plains, suite 


burgh, zipcode: 90566-7771, geo: (lat 9509 
rforming hot reload. 
stasia.net nmnan (name Neckow-Cri atchP zi 


T ePageSt & 
void getData() asyr 
myResponse - 
await http.get(Uri.parse( 


); 


Leanne Graham 


Ervin Howell 


if (myResponse.statusCode > { 
var dataResponse = json.decode(my 
data = dataResponse; 
print(data); 
else { 


print( 


Clementine Bauch 


Patricia Lebsack 


Chelsey Dietrich 


Mrs. Dennis Schulist 


Nicholas Runolfsdottir V 


@override 
Widget build(BuildContext context) { 
natiinr IA 


Glenna Reichert 


7 DEBUG CONSOLE clude Clementina DuBuque 


D/EGL_emulation(29@65): app_time_sta avg=5271.79ms min=5271.79ms max=5271.79ms count=1 

I/flutter (29065): (fid: 1, name: Leanne Graham, username: Bret, email: Sincere@apri , address: (stree 
t: Kulas Light, suite: Apt. 556, city: Gwenborough, zipcode: 9 8-3874, geo: (lat 3159, Ing: 81.149 
6}}, phone: 1-770-736-8031 x56442, website: hildegard.org, company: (name: Romaguera-Crona, catchPhrase: M 
ulti-layered client-server neural-net, bs: harness real-time e-markets)), (id: 2, name: Ervin Howell, user 
name: Antonette, email: Shanna@melissa.tv, address: (street: Victor Plains, suite: Suite 879, city: Wisoky 
burgh, zipcode: 90566-7771 (lat: -43.9509, Ing: -34.4618)), phone: @10-692-6593 x@9125, website: ana 


stasia.net. comnanv: (name: Deckow «t atchPhrase: Proactive didactic continsenc hs: «vnereize scala 


Bu e -. ec m D e > D 
Ini coba direstart maka eror 
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. Home tate extends State«HomePa 


data 


void getData() 
var myResponse - 
await http.get(Uri.parse( 
)); 


(myResponse.statusCode == 200) { 
V dataResponse - json.decode(myResponse.body) as List; 
data - dataResponse; 
print(data); 


DEBUG CON: 


package:flutter/../rendering/binding.dart:363 


package: flutter/../scheduler ndi dart:1144 


package: flutter/../scheduler/ 


e:flutter/../scheduler/binding.dart 


age: Tiutter/../scheduler/bindin 
elided 11 frames from class _RawReceivePortImpl, _Timer, dart:async, and dart:async-patch) 


D/EGL emulation(29065): app time stats: avg-12083.72ms min-12083.72ms max-12083.72ms count=1 


B e ». ec m Bue: » 


Del 


B ow du 053 
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Is.get app), 
appBar: AppBa 
title: t( ns 
), 
body: ListView.builder( 
itemCount: data. length, 
itemBuilder: ((context, index) { 
final dataUser = data[index]; 
ListTile( 
title: Text( 


dataUser| ' 
); 
E 
HUE 


DEBUG CONSOLE clude : x 
scheduler ding.dart:1081 


package:flutter 


.ckage:flutter/../scheduler/binding.dart:862 
(elided 11 frames from class _RawReceivePortImpl, class Timer, dart:async, and dart:async-patch) 
D/EGL emulation(29065): app time stats v 3.7 z1 3.72ms max-12083 


Reloaded 1 of 654 libraries in 716ms 
D/EGL emulation(29065): app time stats 


Lalu save maka dia kosong karna belum target 
Ketika di klik button 


caffold( 
floatingActionButton: FloatingAct utton( 
onPressed: getData, 
child: Icon(Icons.get app), 
ys r r 
appBar: AppBar( 
title: Text( P 
» 


body: ListView.builder( 


itemCount: data.length, 
itemBuilder: ((context, index) ( 
final dataUser - data[index]; 
ListTile( 
title: Text( 
dataUser[ 


» 


7 DEBUG CONSOLE 


bjj, phone: 1-//0-/3b-8031 x>0442, website: niidegara.org, company me: Komaguera-Lrona, catcnrnrase 
ulti-layered client-server neural-net, bs: harness real-time e-markets)), (id: 2, name: Ervin Howell, use 
name: Antonette, email: Shanna@melissa.tv, address: (street: Victor Plains, suite: Suite 879, city: Wisoky 
burgh, zipcode: 90566-7771, geo: (lat: -43.9509, Ing: -34.4618)), phone: 010-692-6593 x@9125, website: ana 
stasia.net, company: (name: Deckow-Crist, catchPhrase: Proactive didactic contingency, bs nergize scala 
ble supply-chains)), (id name: Clementine Bauch, username: Samantha, email: Nathangyesenia.net, addres 
s: (street: Douglas Extension, suite: Suite 847, y: McKenziehaven, zipcode: 59590-4157, geo: (lat: -68 
6102, lng: -47.0653)), phone: 1-463-123-4447, website: ramiro.info, company: (name: Romag 


ice. em Bue: » PX 


Del 


B Gan dg 053 
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ja PageSt & 


void getData() asyr 
var myResponse - 
await http.get(Uri.parse( 
)); 


if (myResponse.statusCode == 200) { Ervin Howell 
var dataResponse = json.decode(myResponse.body) 
setState(() { 

data = dataResponse; 


»; 
print(da 


Clementine Bauch 


Patricia Lebsack 


Chelsey Dietrich 


Mrs. Dennis Schulist 


t 


Nicholas Runolfsdottir V 


Glenna Reichert 
Anvarri da 

7 DEBUG CONSOLE clude Clementina DuBuque 
name: Antonette, email: Shannagmeiissa.tv, address: (street: Victor Plains, suite: Suite 879, city 

burgh, zipcode: 90566-7771, geo: (lat: -43.9509, Ing: -34.4618)), phone: 010-692-6593 x@9125, website: ana 
stasia.net, company: (name: Deckow-Crist, catchPhrase: Proactive didactic contingency, bs: synergize scala 
ble supply-chains)), (id: 3, name: Clementine Bauch, username: Samantha, email: Nathangyesenia.net, addres 
s: (street: Douglas Extension, suite: Suite 847, city: McKenziehaven, zipcode 590-4157, geo: (lat: -68 
6102, lng: -47.0653)), phone: 1-463-123-4447, website: ramiro.info, company: (name: Romag 

Reloaded 1 of 654 libraries in 654ms 


D/EGL emulation(29065): app time stats: a 2216.05ms min=14.28ms max-15333.52ms count=7 


B g o 4» 053 


Maka sudah tampil 

Ini ketika di klik 

Gimana cara nya teget tanpa diklik 
Cara nya memakai floatingdi komentar 
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(override Leanne Graham 
build(BuildC context) { 


Ervin Howell 

Clementine Bauch 
ia Lebsack 
sey Dietrich 


Dennis Schulist 


body: ListV builder( las Runolfsdottir V 
itemCount: data.length, 
itemBuilder: ((context, index) ( 


ra Reichert 


5 DEBUG CONSOLE clude x Clementina DuBuque 
iame: Antonette, emali: Snanna@meiassa.tv, address: (street: Victor rigans, suite: Suite 8/9, City: WiSOKy 
burgh, zipcode: 90566-7771, geo: {lat 43.9509, Ing 34.4618)), phone: 010-692-6593 x@9125, website: ana 
stasia.net, company: (name: Deckow-Crist, catchPhrase: Proactive didactic contingency, bs: synergize scala 
ble supply-chains)), (id: 3, name: Clementine Bauch, username: Samantha, email: Nathan@yesenia.net, addres 
s: (street: Douglas Extension, suite ite 847, y: McKenziehaven, zipcode: 59590-4157, geo: (lat: -68 
6102, lng: -47.0653)), phone: 1-463-123-4447, website: ramiro.info, company: (name: Romag 
Reloaded 1 of 654 libraries in 597ms 
D/EGL emulation(29065): app time stats: avg-2165.49ms min-13.768ms max-1232 


Del 


B e zx em Bu e > » ^ ^8 B 9 EW oss 


Listview kita bungkus dgn builder 
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eanne Graham 
Ervin Howell 


Clementine Bauch 
body: ListView.builder( 
itemCou 


Patricia Lebsack 
Wrap with w 


Wrap with Builder 


Chelsey Dietrich 


itemBui 
final 


Mrs. Dennis Schulist 


Wrap with Center 
Wrap with Column 
Wrap with 


Wrap with Padding Nicholas Runolfsdottir V 


Wra 
Glenna Reichert 


ap with Size 


DEBUG , c uil j SS Clementina DuBugue 
5 DEBUC Wrap with StreamBuild mentina DuBuqui 


ame; Antonette, emali: > istreet: victor riains, suite te 8/9, city 


^ e Extract Meth 
burgh, zipcode: 90566-7771 e ` 2: -34.4618)), phone: 010-6 3 x@9125, website: ana 


WiSsOKy 


stasia.net, company: (name Extract L i le se: Proactive didactic contingency, bs: synergize scala 


ble supply-chains}}, {id Extract Widge username: Samantha, email: Nathan@yesenia.net, addres 


s: {street: Douglas Extens y: McKenziehaven, zipcode: 59590-4157, geo: {lat 68 


6102, Ing: -47.0653)), phone: 1-463-123-4447, web: r , company: (name: Romag 


Reloaded 1 of 654 libraries in 597ms 
D/EGL emulation(29065): app time stats: avg-2165.49ms min=13.7@ms max-12327.95ms count=6 


"» C WM 6B o e -> E ^ ^ 8 B (un d) 053 
Lalu ganti builder dgn FutereBuilder disini eror karna membuthkan 1 parameter 
wajib 

Future 

Ini apa bentuk nya future kita pakai dgn getData mengunkan function 

Disni eror 


Xx 


e 


Edit Selection View Go Run Terminal Help 


@override 
Widget build(BuildContext context) { 
1 Scaffold( 


returr 


body: Futur ilder( 

future: getDakta(), 
builder: (context, snapshoot) { 
return ListView. builder( 


itemCount: data. length, 


itemBuilder: ((context, index) { 


DEBUG CONSOLE 


e, emali: on 5: (street: vi 


de: 9 1 >: (1 43.9509, Ing: -34.4618}}, 


stasia.net, company: {name: Deckow-C catchPhrase: Proa 
ble supply-chains)), (id name: Clementine Bauch, username 
s: (street: Douglas Extension, suite: Suite 847, ci 
6102, Ing: -47.0653)), phone: 1-463 4447, we 


Reloaded 1 of 654 libraries in 597ms 


email 
McKenziehaven, 


ramiro.inf 


© main dart - http request - Visual Studio Co... D E GB | 08 


lains, Suite: Suite 5/9, Cit 
010-692-6593 x@912 


ve didactic contingency, bs: synergize scala 


zipcode: 59590-4157, geo: {lat 


, company: {name: Romag 


D/EGL emulation(29065): app time stats: avg-2165.49ms min=13.7@ms max=12327.95ms count=6 


Bue: » 


, website 


Nathan@yesenia.net, 


ana 


addres 


68 


eanne Graham 


Ervin Howell 


Clementine Bauch 


Patricia Lebsack 


Chelsey Dietrich 


Mrs. Dennis Schulist 


Nicholas Runolfsdottir V 


Glenna Reichert 


Clementina DuBuque 


a ^ 


Del 


Karena bentuk nya future maka kita ganti dan tambah snapshot sebalah context 


Itembuilder ganti builder 
Void ganti future 


Edit Selection View Go Run Terminal Help . art - http reque 


ojmePage((Key? key}) super(key: 
@override 


State<Home 


2> createState() 


s _HomePageState extends State<Ho 


List data = []; 


Future getData() 
var € Future 

FutureBuilder 
FutureOr 
TickerFuture 
SynchronousFuture 
RestorableRouteFuture 
FadeUpwardsPageTransitionsBuilder 
HeroFlightShuttleBuilder 


burgh, zipcode: 90566-7771, geo: (lat: -43.9509, Ing: -34.4618)), phone 


t 


ementine Bauch, username 


stasia.net, company: (name ckow ja chPhrase: Proa 


c 
c 


e supi chains)), (id: 3, name 
s: (street: Douglas Extension, suite: Suite 847, city: McKen 
61 Ing: -47.0653)) 


Reloaded 1 of 654 libraries in 597ms 


ehaven, 
phone: 1-463 4447, website: ramiro.inf 


Visual Studio Co D CQ (B | 0$ 


The result of an 
asynchronous 
computation. 


An asynchronous 
computation cannot 
provide a result 
immediately when it is 
started, unlike a 
synchronous 
computation which 
does compute a result 
immediately by either 
returning a value or by 
throwing. An 
asynchronous 
computation may need 
to wait for something 
external to the program 
(reading a file, guerying 
a database, fetching a 


010-692-6593 x09125, website 


email: Nathan@yesenia.net, 
zipcode: 59590-4157, geo: (lat 


company: (name: Romag 


D/EGL emulation(29065): app time stats: avg-2165.49ms min=13.7@ms max-12327.95ms count=6 


ana 


e didactic contingency, bs: synergize scala 
addres 


68 


Ervin Howell 


Clementine Bauch 


Patricia Lebsack 


Chelsey Dietrich 


Mrs, Dennis Schulist 


Glenna Reichert 


Clementina DuBuque 


Mka sudah clear 
App terkomentar 


B ow» 053 


& 8 go 4» 053 
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@override 
Wid build (BuildContext context) { 
old( 


Leanne Graham 


Clementine Bauch 


Patricia Lebsack 


appBar: AppBar( 
title: Text("G 


Mrs. Dennis Schulist 


Build 
future: getData(), 
builder: (context, snapshoot) { Nicholas Runolfsdottir V 
return ListView.builder( 
itemCount: data.length, 
itemBuilder: ((context, index) ( Clementina DuBuque 


Kurtis Welssnat 


Glenna Reichert 


6 DEBUG CONSOLE 
L.1450)j, phone: à J0-5051 x50441, website: niidegara.org, company: (name; Komaguera-Lrona 
hrase: Multi-layered client-server neural-net, bs: harness real-time e-markets)), (id , name 
owell, username: Antonette, email: Shanna@melissa.tv, address: (street: Victor P "s, te: Suite 87 
y: Wisokyburgh, zipcode: 90566-7771, geo: (lat: -43.9509, Ing: -34.4618)), phone: 810-692-6593 xe 
website: anastasia.net, company: (name: Deckow-Crist, catchPhrase: Proactive didactic contingenc 
y» synergize scalable supply-chains)), (id: 3, name: Clementine Bauch, username: Samantha, email: N 
athangyesenia.net, address: (street: Douglas Extension, suite: Suite 847, city: McKenziehaven, zipcode 


59590-4157, geo: (lat: -68.6102, Ing: -47.0653)), phone: 1-463-123-4447, website: ramiro.info, compan 


el 
- 
E 
8 
= 
g 
S 


Dez, © 8 Bae»: er 


Lalu print dihapus 
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ePageSt & 
Future getData() async { 


var myResponse - 
await http.get(Uri.parse( 
)); 


eanne Graham 


Ervin Howell 


if (myResponse.statusCode { 
var dataResponse = json.decode(myResponse.body) 
setState(() { 
data = dataResponse; 


}); 
print(da 


Clementine Bauch 


Patricia Lebsack 


Chelsey Dietrich 


Mrs. Dennis Schulist 


{ 


Nicholas Runolfsdottir V 


Glenna Reichert 


Anvarrida 


Clementina DuBuque 


6 DEBUG CONSOLE 
L.19Yojj, pnone: 1-/ 931 X»0444, website: niigegard.org, company: (name: Komaguera 
hrase: Multi-layered client-server neural-net, bs: harness real-time e-markets}} , Mame: Ervin H 
owell, username: Antonette, email: Shanna@melissa.tv, address: {street: Victor Plains, suite: Suite 87 
9, city: Wisokyburgh, code: 90566-7771, geo: (lat: -43.9509, Ing: -34.4618)), phone: 810-692-6593 xe 


9125, website: anastasia.net, company: (name: Deckow-Crist, catchPhrase: Proactive didactic contingenc 


y, synergize scalable supply-chains)), (id: 3, name: Clementine Bauch, username: Samantha, email: N 


athan@yesenia.net, address: (street: Douglas Extension, suite: Suite 847, city: McKenziehaven, zipcode 


59590-4157, geo: (lat: -68.6102, Ing: -47.0653)), phone: 1-463-123-4447, website: ramiro.info, company 


B G Zw 053 


xx 
a 
9 
B 
2 
E 
o 
o 
> 
> 
Q 


lalu restart 
Maka dia otomatis terget otomatis 
Disini hanya menambahkan title bisa menambahkan leading 
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@ 


ePagest 
body: FutureBuilder( 


future: getData(), 
builder: (context, snapshoot) { 
return ListView. builder( 
itemCount: data.length, 
itemBuilder: ((context, index) { Ervin Howel 
final dataUser = data[index]; 
Tile( 
title: Text( Patricia Lebsack 
dataUser[ If 
)» 


leading: CircleAvatar(), Mrs. Dennis Schulist 


lementine Bauch 


helsey Dietrich 


E 


Kurtis Weissnat 


Nicholas Runolfsdottir V 


Slenna Reichert 


[] DEBUG CONSOLE | lementina DuBugue 


EGL emulation(29065): app time stats 2ms mi s count=5 
EGL emulation(29065): app time stats 


D, 

D, 

D/EGL emu 29065): app time stats: av 44ms mi count=5 
D/EGL emulation(29065): app time stats: av 7 count=4 
D/EGL emulation(29065): app time stats 2243 i = 6 count=5 
D/EGL emulation(29065): app time stats 3 7 unt 
Reloaded 1 of 654 libraries in 713ms 


D/EGL emulation(29065): app time stats 23 s min-16.90ms max-654.61ms count=5 


H e zx E B B o e > $ d 
Kasih bcaround warnanya 
Lalu kasih substitle nya disini ada email 


Edit Selection View Go Run Terminal Help main dart - http request - Visual Studio Co... D CJ D 


Del 


8 go dd 053 


Gl 


PaaeSt 


body: FutureBuilder( 
future: getData(), 
builder: (context, snapshoot) { 
return ListView.builder( 
itemCount: data.length, 
itemBuilder: ((context, index) ( Ervin How 
final dataUser - data[index]; 
return ListTile( lementine Bauch 
title: Text( 
dataUser['n (E Patricia Lebsack 
)» 
leading: CircleAvatar Chelsey Dietrich 
backgroundColor: li 


) Mrs. Dennis Schulist 
5 / 


Leanne Graham 


subtitle: Text (dataUser[ 


Kurtis Welssnat 


LI 


6 DEBUG CONSOLE Nicholas Runolfsdottir V 


EGL emulation(298! app time stats: av i 3.14ms max=598.7@ms count-4 
EGL emulation( app time stats v 3 i 5.65ms max-267.81ms count=7 Glenna Reichert 
EGL emulation(29 app time stats minz110.33ms max=235.34ms count=8 
EGL_emulation( app_time_stats: av 78.49ms count=8 si 
= E Clementina DuBuque 
)/EGL emulation( app time stats: av max-264.47ms count-24 
EGL emulation(29065): app time stats: a 6.47 5.97ms count=46 
EGL emulation(29065): app time stats E maxz58.96ms countz51 


EGL emulation(29065): app time stats s max=45.49ms count-5e 


D 


> em B oe: » 4 
Disni udampil tanpa klik button 
Berikutnya kita membhas 


B Sw ZW 053 


© 


Edit Selection View Go Run Terminal Help 


appBar: 
title: Ya 
), 
body: ( 
future: getData(), 
builder: (context, snapshoot) { 
.builder( 
itemCount: data.length, 


itemBuil ((context, index 


dataUser - data[in 


( 
title: ( 


dataUser[ 


DEBUG CONSOLE 


Dez ER a BD pe d s Yas B (3 ZW 054 


Apa itu 


Adalah sebuah proses apakah builder dalam sebuah proses atau sudah berhasil 


menget 
Misal kan internet lemot maka get nya lama 


Jadi proses waiting jadi get nya masih waiting atau menungu dia belum sepenuhnya 


menget 

Kita bisa taruh cara seperti ini 

Buat disni if snapshot 

Ini apabila snap nya masih menunggu belum nemapilkan get maka kita 
menampilkan 

CirclurarProgress kalau dia berhasil 

Maka dia akan menreturn 

Listview 


View Go Run Terminal Help * main.dart - http request - Visual Studio Co 


title: Text( 
» 
body: FutureB 
future: 


Leanne Graham 


builder: (context, snapshoot) 4 


if (snapshoot.connectionState nnec .waiting) ( 


CircularProgressInd 
CircularProgressIndi 


Ervin Howe 


Slementine Bauch 


Patricia Lebsack 


ListView.builder( 
itemCount: data.lengt 
itemBuilder: ((context, index) ( 

final dataUser - data[index]; 
return ListTile( 
title: Text( 


Chelsey Dietrich 


Mrs. Dennis Schulist 


Kurtis Weissnat 


7 DEBUG CONSOLE Nicholas Runolfsdottir V 


EGL emulati 29065): app time vg-216 i 1.77ms 53.48ms count 
EGL emulation(29065): app time stat 2 3ms count 
EGL emulation(29065): app time t v 2 i count 
EGL_emulation(29065): app_time_stats: av 1 count=5 


Glenna Rei 


Clementina DuBuque 
EGL emulation(29065): app time stats: av count=5 9 


)/EGL emulation(29065): app time stats 
)/EGL emulation(29065): app time stats 
EGL emulation(29065): app time stats max-248.5 


B e zx E m D o ex > 


Maka di pindahkan 
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itemCount: data.length, 
itemBuilder: ((context, index) { 
final dataUser = data[index]; 
return ListTile( 
title: Text( 
dataUser['name'], 
» 
leading: CircleAvatar( 
backgroundColor: Mcolors.grey, 
E A 


subtitle: Text(dataUser| 'email')), 


7 


D/EGL_emulation app_time v s mi ma 7ms 
EGL_emulation( 5 app_time_stats: avg= 32ms ma 67ms 
EGL_emulation( 5 app_time_stats ^ 6ms ma 95ms 


EGL emulation app time stats: av i 25ms ma 79ms count 


)/EGL emulation 5 app time stats: a S 53ms max=229.93ms count 


EGL_emulation app_time_stats V 7.9 s 9 8ms 241.64ms count 
ries in 644ms 


D/EGL 6 app time stats 91.10ms min-3.90ms max-586.18ms count-108 


zm WI Bae»: lé ^ 


Circular kita bungkus di tengah 


Del 


B G a ag 054 


Edit Selection View Go Run Terminal Help main.dart - http request - Visual Studio Co... ID C2 O | 08 


future: getData(), 
builder: (context, snapshoot) { 


if (snapshoot.connectionState d nS 


return C sIndicat 


t 
Lis 
itemCount: data.length, 
itemBuilder: ((context, index) ( 
final dataUser = data[index]; 
ListTile( 
title: Text( 
dataUser[ 
); 
leading: Circ 
backgroundColor: W col 
» 


returr 


8 


D/EGL emulation 
D/EGL emulation 


Reloaded 1 of 6 


DEBUG CONSOLE 
29065) 
29065) 
4 libraries in 


app_time_stats 
app_time_stats 


2ms 


6.44ms min-4.31ms max-10.55ms count=31 


79ms max=16.23ms countz38 


29065) 
29065) 
EGL emulation 65) 
)/EGL emulation(29065) 
EGL 


76.09ms coun 
20.62ms 


D/EGL emulation( app time stats 


EGL emulation( app time stats count=31 
maxz18.52ms 
79ms 


max=34.2 


app_time_stats count=31 


app_time_stats s max-18 count 238 


emulation(29065): app time stats count 338 


Ini kenapa belum muncul maka ini kita hapus 
setState karna sudah memakai builder 


Edit 


Selection View Go Run Terminal Help main dat - http request - Visual Studio Co... E) ND | 08 


g @ 


class _HomePageState extends State<HomeP 


List data = []; 


Future getData() 


var 


if (myResponse.statusCode 
json.decode(myResponse.body) a 


var 


myResponse = 
await http.get(Uri. 
)); 


dataResponse = 


dataResponse; 


print( 


8 DEBL 


D/EGL emulation( 29065) 
D/EGL emulation(29065) 
D/EGL emulation(29065) 
D/EGL emulation(29065) 
D/EGL_emulation( 29065) 
D/EGL emulation(29065) 
Reloaded 1 of 654 librar 


D/EGL emulat (29065) 


ot 


ec >» € NW 


); 


JG CONSOLE 
app_time_stats 
app_time_stats 
app_time_stats 
app_time_stats 
app_time_stats 
app_time_stats 
ies in 621ms 
app_time_stats 


arse( 


200) { 


count=31 
31 
@5ms count=31 


20.02ms count 

Sms max=12 
9.53ms coun 

9.05ms coun 


Ba e < 5» 


Ketika pakai builder kita tidak usah pakai setState 


Retart lagi 


Dei 


BED ag 054 
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Future getData() 
var myResponse - 
await http.get(Uri.parse( 
); 


if (myResponse.statusCode -- 200 
var dataResponse - json.decode(myResponse.body) as 


data - dataResponse; 
ye 
); 


@override 
Wid build(BuildCon context) { 
8 DEBUG CONSOLE 


Restarted application in 1,439ms 
D/EGL_emulation(29065): app_time_stats: avg=259.47ms min=5.83ms max=3266.15ms count=13 


T 


P > © B D o e < > 


Leanne Graham 


Ervin Howe 


lementine Bauch 


lsey Dietrich 


Mrs. Dennis Schulist 


Nicholas Runolfsdottir V 
Glenna Reichert 


ntina DuBugue 


^^ B B 9 c d) 054 


Maka dia loading sedikit karna data nya sedikit 
Coba kasih waktu 
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class HomePageState extends State«HomePe 


List data - []; 


Future getData() async ( 
await Future.delayed(Duration(seconds: 3));| 
var myResponse - 
await http.get(Uri.parse( 
)); 


if (myResponse.statusCode == 200) { 
var dataResponse = json.decode(myResponse.body) as 
data dataResponse; 


print( 5 


9 DEBUG CONSOLE 
D/EGL emulation(29065): app time stats: avg-259.47ms min-5.83ms max-3266.15ms count-13 
D/EGL emulation(29065): app time stats 
D/EGL emulation(29065): app time stats 
D/EGL emulation(29065): app time stats Lëns max-26.83ms count-48 
Reloaded 1 of 654 libraries in ms 
D/EGL emulation(29065): app time stats 7.45ms min=6.65ms max=22579.95ms count-10 
D/EGL emulation(29065): app time stats v in=4.45ms max=45.82ms count=55 
D/EGL emul on(29065): app time stats in-4.06ms max-11.12ms count-60 


Gene dg 054 


myApp StatelessWidget { 
({Key? key}) : (key: key); 


@override 

Widget Id(BuildContext context) { 
MaterialApp( 

home: homePagel), 

Jp 

} 

} 


homePage StatefulWidget { 
| ge({Key? key}) : (key: key); 


@override 
State<homePage> 


} 


_homePageState nds State<homePage> { 
String body = : 
List data = []; 


D 


Future getl 10] 1 
Future.dela (Duration(seconds: 3)); 
myRespon = 
http.get(Uri. ( 


(myRespon.statusCode == 200) 4 

responData = json.decode(myRespon.body) List; 
data = responData; 

(data); 


Da 


@override 


Widget build(BuildContext context) 4 
Scaffold( 


appBar: AppBar( 
title: Text( ), 
centerTitle: ; 
), 
body: FutureBuilder( 
future: getData(), 
builder: (context, snapshoot) { 
(snapshoot.connectionState == ConnectionState.waiting) { 
n Center(child: CircularProgressIndicator()); 
{ 
n ListView. builder( 
itemCount: data.length, 
itemBuilder: ((context, index) { 
dataUser = data[index]; 
ListTile( 
title: Text( 
dataUser[ Ik 
Di 
leading: CircleAvatar( 
backgroundColor: Colors.blue, 
) 


subtitle: Text(dataUser[ 1), 


